@extends('layouts._blank')
@section('content')
    <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 管理员管理 <span
                class="c-gray en">&gt;</span> 管理员列表 <a class="btn btn-success radius r"
                                                       style="line-height:1.6em;margin-top:3px"
                                                       href="javascript:location.replace(location.href);" title="刷新"><i
                    class="Hui-iconfont">&#xe68f;</i></a></nav>

    <div class="page-container mt-10">
        <div class="text-c"> 日期范围：
            <input type="text" onfocus="WdatePicker({ maxDate:'#F{$dp.$D(\'datemax\')||\'%y-%M-%d\'}' })" id="datemin"
                   class="input-text Wdate" style="width:120px;">
            -
            <input type="text" onfocus="WdatePicker({ minDate:'#F{$dp.$D(\'datemin\')}',maxDate:'%y-%M-%d' })"
                   id="datemax" class="input-text Wdate" style="width:120px;">
            <input type="text" class="input-text" style="width:250px" placeholder="输入管理员名称" id="" name="">
            <button type="submit" class="btn btn-success" id="" name=""><i class="Hui-iconfont">&#xe665;</i> 搜用户
            </button>
        </div>
        <div class="cl pd-5 bg-1 bk-gray mt-20"><span class="l"><a href="javascript:;" onclick="datadel()"
                                                                   class="btn btn-danger radius"><i
                            class="Hui-iconfont">&#xe6e2;</i> 批量删除</a> <a href="javascript:;"
                                                                          onclick="admin_add('添加管理员','admin-add.html','800','500')"
                                                                          class="btn btn-primary radius"><i
                            class="Hui-iconfont">&#xe600;</i> 添加管理员</a></span> <span class="r">共有数据：<strong>54</strong> 条</span>
        </div>
        <table id="data-list" class="table table-border table-bordered table-striped table-hover">
            <thead>
            <tr>
                <th><input type="checkbox" name="" value=""></th>
                <th>id / 用户id</th>
                <th>name / 用户名</th>
                <!--<th>password / 密码</th>-->
                <th>phone / 手机</th>
                <th>qq / QQ号</th>
                <th>time / 创建时间</th>
                <th>status_info / 状态</th>
                <th class="text-c">operate / 操作</th>
            </tr>
            </thead>
        </table>
    </div>
@endsection

@section('script')

    <script>
        $('#data-list').dataTable({
            "order": [[1, "desc"]],
            "processing": true,
            "serverSide": true,
            "ajax": {
                "url": "{{url('/admin/data')}}"
            },
            "columns": [

                {
                    "render": function (data, type, row, meta) {
//                        console.log(row);
                        return '<input type="checkbox" name="id[]" value="' + row.id + '">'
                    },
                    "orderable": false
                },
                {"data": "id"},
                {"data": "name"},
                {"data": "email"},
//                {"data": "password"},
                {"data": "created_at"},
                {"data": "updated_at"},
                {
                    "data": "status",
                    "render": function (data, type, row, meta) {
                        switch (parseInt(data)) {
                            case -1:
                                return '<span class="label label-danger radius">' + row.status_info + '</span>';
                                break;
                            case 0:
                                return '<span class="label label-danger radius">' + row.status_info + '</span>';
                                break;
                            case 1:
                                return '<span class="label label-success radius">' + row.status_info + '</span>';
                                break;
                        }

                    },
                    "className": "text-c"

                },
                {
                    "render": function (data, type, row, meta) {
                        var button = '';
                        switch (parseInt(row.status)) {
                            case -1:
                                button = '<a href="javascript:void(0);" onclick="start(' + row.id + ')" title="解冻"><i class="Hui-iconfont Hui-iconfont-shangjia"></i></a>';
                                break;
                            case 0:
                                button = '<a href="javascript:void(0);" onclick="start(' + row.id + ')" title="解冻"><i class="Hui-iconfont Hui-iconfont-shangjia"></i></a>';
                                button += '<a class="ml-5" href="javascript:void(0);" onclick="del(' + row.id + ')" title="删除"><i class="Hui-iconfont Hui-iconfont-del3"></i></a>';
                                break;
                            case 1:
                                button = '<a href="javascript:void(0);" onclick="stop(' + row.id + ')" title="冻结"><i class="Hui-iconfont Hui-iconfont-xiajia"></i></a>';
                                break;
                        }

                        button += '<a class="ml-5" href="javascript:void(0);" onclick="show_account(' + row.id + ')" title="查看提款账号"><i class="Hui-iconfont Hui-iconfont-bank"></i></a>';
                        button += '<a class="ml-5" href="javascript:void(0);" onclick="set_phone(' + row.id + ')" title="修改手机"><i class="Hui-iconfont Hui-iconfont-phone"></i></a>';
                        button += '<a class="ml-5" href="javascript:void(0);" onclick="show_rate(' + row.id + ')" title="查看比例"><i class="Hui-iconfont Hui-iconfont-shujutongji"></i></a>';
                        return button;

                    },
                    "orderable": false,
                    "className": "text-c"
                }

            ]

        });

        function del(id) {
            status(id, 'del')
        }
        function start(id) {
            status(id, 'start')
        }
        function stop(id) {
            status(id, 'stop')
        }
        function status(id, status) {
            $.ajax({
                type: 'GET',
                url: '{:U(status)}',
                data: 'id=' + id + '&status=' + status,
                dataType: 'json',
                success: function (result) {
                    if (result.status === 1) {
                        layer.alert(result.info, {icon: 6}, function () {
                            location.reload();
                        });
                    } else {
                        layer.alert(result.info, {icon: 5});
                    }
                }

            })
        }
        function show_account($id) {
            layer_show('绑定账号信息', '{:U(account)}?id=' + $id, 480, 480)
        }
        function set_phone(id) {
            layer.prompt({
                formType: 0,
                title: '请输入新的手机号',
            }, function (value, index, elem) {
                $.ajax({
                    type: 'GET',
                    url: '{:U(setPhone)}',
                    data: 'id=' + id + '&phone=' + value,
                    dataType: 'json',
                    success: function (result) {
                        if (result.status == 1) {
                            layer.alert(result.info, {icon: 6}, function () {
                                location.reload();
                            });
                        } else {
                            layer.alert(result.info, {icon: 5});
                        }
                    }

                })
            });
        }

    </script>

    <script type="text/javascript">
        /*
         参数解释：
         title	标题
         url		请求的url
         id		需要操作的数据id
         w		弹出层宽度（缺省调默认值）
         h		弹出层高度（缺省调默认值）
         */
        /*管理员-增加*/
        function admin_add(title, url, w, h) {
            layer_show(title, url, w, h);
        }
        /*管理员-删除*/
        function admin_del(obj, id) {
            layer.confirm('确认要删除吗？', function (index) {
                $.ajax({
                    type: 'POST',
                    url: '',
                    dataType: 'json',
                    success: function (data) {
                        $(obj).parents("tr").remove();
                        layer.msg('已删除!', {icon: 1, time: 1000});
                    },
                    error: function (data) {
                        console.log(data.msg);
                    },
                });
            });
        }

        /*管理员-编辑*/
        function admin_edit(title, url, id, w, h) {
            layer_show(title, url, w, h);
        }
        /*管理员-停用*/
        function admin_stop(obj, id) {
            layer.confirm('确认要停用吗？', function (index) {
                //此处请求后台程序，下方是成功后的前台处理……

                $(obj).parents("tr").find(".td-manage").prepend('<a onClick="admin_start(this,id)" href="javascript:;" title="启用" style="text-decoration:none"><i class="Hui-iconfont">&#xe615;</i></a>');
                $(obj).parents("tr").find(".td-status").html('<span class="label label-default radius">已禁用</span>');
                $(obj).remove();
                layer.msg('已停用!', {icon: 5, time: 1000});
            });
        }

        /*管理员-启用*/
        function admin_start(obj, id) {
            layer.confirm('确认要启用吗？', function (index) {
                //此处请求后台程序，下方是成功后的前台处理……


                $(obj).parents("tr").find(".td-manage").prepend('<a onClick="admin_stop(this,id)" href="javascript:;" title="停用" style="text-decoration:none"><i class="Hui-iconfont">&#xe631;</i></a>');
                $(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">已启用</span>');
                $(obj).remove();
                layer.msg('已启用!', {icon: 6, time: 1000});
            });
        }
    </script>
@endsection